<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>--%>
<%@ include file="/public/header/permissionCommon.jspf" %>

<head>
    <%--<link rel="stylesheet" href="${webPath}/css/report/public.css">--%>
    <%--<link rel="stylesheet" href="${webPath}/js/layui/css/layui.css">--%>
    <link rel="stylesheet" href="${webPath}/css/report/public.css">
    <style>
        .chart-area {
            height: 256px;
            text-align: center;
            line-height: 500%;
            border: 1px solid #cecece6b;
        }
        .layui-container {
            padding: 0;
        }

        .layui-card {
            background-color: #eaeaea;
        }

        .layui-card-header {
            color: #333;
        }

        .layui-card-body {
            font-size: 32px;
        }

        /*结算比区域*/
        .settlementAndEvaluate {
            width: 100%;
            height: 100%;
        }
        .settlementAndEvaluate label{
            position: absolute;
            left: 24px;
            top: 24px;
            font-size: larger;
        }
        .settlementAndEvaluate span{
            position: relative;
            top: 60px;
            font-size: 48px;
        }

    </style>
</head>


<!--右侧主体区域-->
<div class="layui-row full-width">
    <div class="layui-panel panel">
        <form class="layui-form layui-form-pane" action="" lay-filter="filter-form">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">日期</label>
                    <div class="layui-input-inline">
                        <input type="text" name="yearMonth" id="queryDate"  autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>

<div class="layui-container">
</div>

<%--无有效内容--%>
<script type="text/html" id="viewNoDataLayer">
    <div class="full-width" style="color: #9c8e8e;text-align: center;">
        <i class="layui-icon layui-icon-log" style="font-size: 64px;"></i>
        <span style="display: block">没有数据!</span>
    </div>
</script>

<%--月报内容--%>
<script type="text/html" id="viewAreaLayer">

{{#  layui.each(d.rows, function(index, item){ }}
<div class="layui-row">

    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 16px;">
        <legend>{{d.date}}-{{item.title}}</legend>
    </fieldset>

    <%--数据区--%>
    <div class="layui-row layui-col-space5">
        {{#  layui.each(item.cols, function(index, col){ }}
        <div class="layui-col-md{{12/Object.keys(item.cols).length}}">
            <div class="layui-card">
                <div class="layui-card-header">{{col.name}}</div>
                <div class="layui-card-body">
                    {{col.value}}
                </div>
            </div>
        </div>
        {{#  }); }}
    </div>

    <%--绘图区--%>
    <div class="layui-row layui-col-space5">
        {{# var num = item.views.length}}
        {{#  layui.each(item.views, function(index, each){ }}
            <div class="layui-col-md{{12/num}}">
                <div id="{{each.id}}" class="chart-area" >
                </div>
            </div>
        {{#  }); }}

    </div>

</div>
{{#  }); }}



</script>

<%--结评比--%>
<script type="text/html" id="settlementAndEvaluateLayer">
    <div class="settlementAndEvaluate">
        <lable>结评比</lable>
        <span>{{d.value}}</span>
    </div>
</script>

<script>
</script>

<script src="${webPath}/js/largescreen/echarts.min.js"></script>
<script src="${webPath}/js/report/monthly.js" type="module"></script>
